import { useEffect, useState } from 'react';
import styles from './Detail.module.scss';
import { getDetail } from './detailAPI';

const useDetailService = (id = 1) => {
  const [detailState, setDetailState] = useState('none');
  useEffect(() => {
    (async () => {
      try {
        const { data: { author } } = await getDetail(id);
        setDetailState(author);
      } catch (error) {
        console.log(error);
      }
    })();
  }, []);
  return { detailState };
};
const Detail = () => {
  const { detailState } = useDetailService();
  return (
    <div>
      <h1 className={styles.re}>{detailState}</h1>
    </div>
  );
};

export default Detail;
